<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>
        <%= title %>
    </title>
    <link href="image/favicon.ico" rel="shortcut icon">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_607959_yj2cy58saud.css">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="/css/userInfo.css">
    <link rel="stylesheet" href="css/loading.css">
    <link rel="stylesheet" href="css/tcggame.css">
</head>

<body class="tcggamebody">
    <div class="tcgcontainer container">
        <!-- loading -->
        <div class="loading" v-show="loading">
            <div class="preloader_4">
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
        <!-- 左部热门彩种 -->
        <div class="tcgleft">
            <div class="tcglogo">
                <a href="/">
                    <img src="/image/tcglogo.png" alt="" class="img-responsive" />
                </a>
            </div>
            <!-- 热门导航 -->
            <div class="tcgnav">
                <!-- 主页购彩大厅 -->
                <div class="lotterytype">
                    <div class="maintop">
                        <div class="hotfloor">
                            <i class="icon iconfont icon-iconset0195"></i>
                            <span class="hotfloorname" @click="toggletcgurl('Lobby','Lobby')">
                                <%= __('tcgnav2') %>
                            </span>
                        </div>
                        <div class="foldicon" @click="toggletcgurl('Lobby','Lobby')">
                            <i class="icon iconfont icon-shuaxin"></i>
                        </div>
                    </div>
                </div>
                <!-- 热门导航彩种选择 -->
                <div class="lotterytype">
                    <div class="maintop">
                        <div class="hotfloor">
                            <i class="icon iconfont icon-fav-1"></i>
                            <span class="hotfloorname">
                                <%= __('tcgnav1') %>
                            </span>
                        </div>
                        <div class="foldicon">
                            <i class="icon iconfont icon-sanjiaodown"></i>
                        </div>
                    </div>
                    <ul class="lotteryhot">
                        <li class="sublottery" @click="toggletcgurl('BTSFFC','Betting')">
                            <div class="sublotterycontainer">
                                <img src="https://images.uxgaming.com/TCG_GAME_ICONS/Lotto/tcgdemo/BTSFFC.png" class="img-responsive">
                                <span class="sublotteryname"><%= __('tcghotgame1') %></span>
                            </div>
                        </li>
                        <li class="sublottery" @click="toggletcgurl('BTS11X5','Betting')">
                            <div class="sublotterycontainer">
                                <img src="https://images.uxgaming.com/TCG_GAME_ICONS/Lotto/tcgdemo/BTS11X5.png" class="img-responsive">
                                <span class="sublotteryname"><%= __('tcghotgame2') %></span>
                            </div>
                        </li>
                        <li class="sublottery" @click="toggletcgurl('BTS28','Betting')">
                            <div class="sublotterycontainer">
                                <img src="https://images.uxgaming.com/TCG_GAME_ICONS/Lotto/tcgdemo/BTS28.png" class="img-responsive">
                                <span class="sublotteryname"><%= __('tcghotgame3') %></span>
                            </div>
                        </li>
                        <li class="sublottery" @click="toggletcgurl('BTSPK10','Betting')">
                            <div class="sublotterycontainer">
                                <img src="https://images.uxgaming.com/TCG_GAME_ICONS/Lotto/tcgdemo/BTSPK10.png" class="img-responsive">
                                <span class="sublotteryname"><%= __('tcghotgame4') %></span>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- 左右切换 back-->
            <div class="tcgmenutoggle"></div>
        </div>
        <!-- 右部tcgiframe -->
        <div class="tcgright">
            <div class="tcgrg-menuhead">
                <div class="menuhead-wrap">
                    <div class="tcguserbanlance">
                        <span class="tcguserbanlancetit">
                            <%= __('tcgbanlance') %>
                        </span>
                        <span class="tcgbanlance" v-html="userinfo.myagbanlance"></span>
                        <i class="icon iconfont icon-shuaxin tcgreload" @click="getagBalance"></i>
                    </div>
                    <div class="togglecoin">
                        <div class="tcgexchangeform-input">
                            <div class="tcgexchangeform-select" :class="{active:togglecoin.isshowcoinarr}" 
                                @click="togglecoin.isshowcoinarr=!togglecoin.isshowcoinarr">
                                <div>
                                    <img :src="'/image/'+exchange.defaultcoin+'.png'" :alt="exchange.defaultcoin">
                                    <span v-html="exchange.defaultcoin"></span>
                                </div>
                                <i class="icon iconfont icon-sanjiaodown"></i>
                            </div>
                            <!-- 下拉菜单 -->
                            <% if(allMine.length){ %>
                                <div class="dropdownmenu" v-show="togglecoin.isshowcoinarr">
                                    <% allMine.forEach( (item,index) => { %>
                                    <div>
                                        <div class="dropdownmenu-item coinitem" 
                                        :class="{selected:'<%- item.coin %>'==exchange.defaultcoin}" 
                                        @click="changeexchangecoin('<%= item.coin %>','<%= item.balance %>')">
                                        <img src="image/<%= item.coin %>.png" alt="">
                                        <span><%= item.coin %></span>
                                        </div>
                                    </div>
                                    <% }) %>
                                </div>
                            <% } %>
                        </div>
                    </div>
                    <div class="tcgrecharge" @click="openistcgdialog"><%= __('tcgrecharge') %></div>
                </div>
            </div>
            <div class="tcgiframe">
                <iframe allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" scrolling="yes" 
                marginwidth="0px" frameborder="0" :src="userinfo.gameurl"></iframe>
            </div>
        </div>
        <!-- TCG兑换遮罩层 -->
        <div class="tcgmodel" v-show="istcgdialog" @click="istcgdialog=false"></div>
        <!-- TCG兑换盒子 -->
        <div class="tcgmodel-popup" v-show="istcgdialog">
            <div class="tcgmodel-con">
                <!-- 个人中心菜单 -->
                <div class="tcgpopuppanel">
                    <!-- 个人中心提示 -->
                    <div class="tcgpersonalcenter">
                        <i class="icon iconfont icon-ren3 tcgmyicon"></i>
                        <span>
                            <%= __('tcgpersonalcenter') %>
                        </span>
                    </div>
                    <!-- 个人中心菜单 -->
                    <ul class="tcgmymenu">
                        <li class="tcgmymenu-list <%= lang %>" :class="{active:showtransforminag}"  @click="changetransform('showtransforminag')">
                            <i class="icon iconfont icon-3"></i>
                            <span>
                                <%= __('tcgrecharge1') %>
                            </span>
                        </li>
                        <li class="tcgmymenu-list <%= lang %>" :class="{active:showtransformout}" @click="changetransform('showtransformout')">
                            <i class="icon iconfont icon-tixian"></i>
                            <span>
                                <%= __('tcgrecharge2') %>
                            </span>
                        </li>
                    </ul>
                </div>
                <!-- 菜单详情 -->
                <div class="tcgpopuprcontent">
                    <!-- 兑换TCG分 -->
                    <div class="tcgexchangebox" v-show="showtransforminag">
                        <div class="tcgexchangebox-head">
                            <div class="tcghead-menu">
                                <%= __('tcgrecharge1') %>
                            </div>
                        </div>
                        <div class="tcgexchangebox-content">
                            <div class="tcgexchangeform">
                                <label class="tcgexchangeform-label">
                                    <%= __('tcgrecharge3') %>
                                </label>
                                <div class="tcgexchangeform-input">
                                    <div class="tcgexchangeform-select" :class="{active:exchange.isshowcoinarr}" 
                                        @click="exchange.isshowcoinarr=!exchange.isshowcoinarr">
                                        <div>
                                            <img :src="'/image/'+exchange.defaultcoin+'.png'" :alt="exchange.defaultcoin">
                                            <span v-html="exchange.defaultcoin"></span>
                                        </div>
                                        <i class="icon iconfont icon-sanjiaodown"></i>
                                    </div>
                                    <!-- 下拉菜单 -->
                                    <% if(allMine.length){ %>
                                        <div class="dropdownmenu" v-show="exchange.isshowcoinarr">
                                            <% allMine.forEach( (item,index) => { %>
                                                <div>
                                                    <div class="dropdownmenu-item coinitem" 
                                                        :class="{selected:'<%- item.coin %>'==exchange.defaultcoin}" 
                                                        @click="changeexchangecoin('<%= item.coin %>','<%= item.balance %>')">
                                                        <img src="image/<%= item.coin %>.png" alt="">
                                                        <span><%= item.coin %></span>
                                                    </div>
                                                </div>
                                            <% }) %>
                                        </div>
                                    <% } %>
                                </div>
                            </div>
                            <div class="tcgexchangeform">
                                <label class="tcgexchangeform-label"><%= __('Currencyexchange') %></label>
                                <div class="tcgexchangeform-input">
                                    <input type="text" v-model="exchangenum" :disabled="exchange.disexchangenum"/>
                                </div>
                            </div>
                            <div class="tcgexchangeform">
                                <label class="tcgexchangeform-label"><%= __('Youwillget') %></label>
                                <div class="tcgexchangeform-input">
                                    <input type="text" v-model="exchange.exchangeagcoin" readonly/>
                                </div>
                                <div class="agconvert-coin"><%= __('TCGPoints') %></div>
                            </div>
                        </div>
                        <div class="tcgexchangebox-footer">
                            <button class="tcgexchange-submit" @click="confirmexchange" :disabled="exchange.disabledbtn"><%= __('confirmv31') %></button>
                        </div>
                    </div>
                    <!-- 兑出TCG分 -->
                    <div class="tcgexchangebox" v-show="showtransformout">
                        <div class="tcgexchangebox-head">
                            <div class="tcghead-menu"><%= __('tcgrecharge2') %></div>
                        </div>
                        <div class="tcgexchangebox-content">
                            <div class="tcgexchangeform">
                                <label class="tcgexchangeform-label">
                                    <%= __('tcgrecharge3') %>
                                </label>
                                <div class="tcgexchangeform-input">
                                    <div class="tcgexchangeform-select" :class="{active:exchange.isshowcoinarr}" 
                                        @click="exchange.isshowcoinarr=!exchange.isshowcoinarr">
                                        <div>
                                            <img :src="'/image/'+exchange.defaultcoin+'.png'" :alt="exchange.defaultcoin">
                                            <span v-html="exchange.defaultcoin"></span>
                                        </div>
                                        <i class="icon iconfont icon-sanjiaodown"></i>
                                    </div>
                                    <!-- 下拉菜单 -->
                                    <% if(allMine.length){ %>
                                        <div class="dropdownmenu" v-show="exchange.isshowcoinarr">
                                            <% allMine.forEach( (item,index) => { %>
                                                <div>
                                                    <div class="dropdownmenu-item coinitem" 
                                                        :class="{selected:'<%- item.coin %>'==exchange.defaultcoin}" 
                                                        @click="changeexchangecoin('<%= item.coin %>','<%= item.balance %>')">
                                                        <img src="image/<%= item.coin %>.png" alt="">
                                                        <span><%= item.coin %></span>
                                                    </div>
                                                </div>
                                            <% }) %>
                                        </div>
                                    <% } %>
                                </div>
                            </div>
                            <div class="tcgexchangeform">
                                <label class="tcgexchangeform-label"><%= __('CashOutpoints') %></label>
                                <div class="tcgexchangeform-input">
                                    <input type="text" v-model="cashoutnum"/>
                                </div>
                            </div>
                            <div class="tcgexchangeform">
                                <label class="tcgexchangeform-label"><%= __('Youwillget') %></label>
                                <div class="tcgexchangeform-input">
                                    <input type="text" v-model="cashout.exchangeagcoin" readonly/>
                                </div>
                                <div class="agconvert-coin" v-html="exchange.defaultcoin"></div>
                            </div>
                        </div>
                        <div class="tcgexchangebox-footer">
                            <button class="tcgexchange-submit" @click="confircashout" :disabled="cashout.disabledbtn"><%= __('confirmv31') %></button>
                        </div>
                    </div>
                </div>
                <!-- 关闭按钮 -->
                <div class="tcgclose">
                    <i class="icon iconfont icon-guanbi" @click="istcgdialog=false"></i>
                </div>
            </div>
        </div>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="/js/tcggame.js"></script>
</body>

</html>